<html>
<head>
<link rel="stylesheet" type="text/css" href="css/dasBrowser.css" />
<link rel="stylesheet" type="text/css" href="css/facebox.css" />
<script type="text/javascript" src="js/jquery-1.4.2.js" ></script>
<script type="text/javascript" src="extJs/sessvars/sessvars.js" ></script>
<script type="text/javascript" src="js/genunz.js" ></script>
<script type="text/javascript" src="js/urlParameters.js" ></script>
<script type="text/javascript" src="js/facebox.js" ></script>
<script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="js/jquery.livequery.js"></script>
<script type="text/javascript" src="extJs/build/yahoo/yahoo-min.js"></script>
<script type="text/javascript" src="extJs/build/event/event-min.js"></script>
<link rel="stylesheet" type="text/css" href="extJs/build/reset/reset-min.css" />
<link rel="stylesheet" type="text/css" href="extJs/build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="extJs/build/base/base-min.css" />
<link rel="stylesheet" type="text/css" href="extJs/build/button/assets/button.css" />
<link rel="stylesheet" type="text/css" href="css/dasBrowser.css">


<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-20265268-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>


</head>
<body class="yui-skin-sam">
 <div style="padding:25px;width:1200px">
  <!-- left panel -->
  <div style="float:left">
  <table border="0px">
    <tr><td style="border:0px;width:50px"><a href="index.html" ><img src="myKaryoView-small.png"></img></a></td></tr>
    <tr><td style="border:0px;text-align:center"><h1>myKaryoView </h1><h3>Personalized Genome Search</h3></td></tr>
  </table>     
  </div>

  <form id="target" action="display.html" method="post">
  
    <!-- search box -->
	  <div style="float:left;margin-left:30px;"> 
       <h1>Search by 
           <a class="clickable" href="#" title="rs10993994">SNP</a>,
           <a class="clickable" href="#" title="SHANK3">gene</a>,
           <a class="clickable" href="#" title="21p11.2">band</a> or
           <a class="clickable" href="#" title="8:5900000,6000000">chromosomal location</a>
       </h1>
	     <input size="30" autocomplete="off" type="text" id="inputString" >
	     <input type="submit" id="viewButton" name="submit"/>

	     <div class="suggestionsBox" id="suggestions" style="display: none;">
	       <img src="img/upArrow.png" style="position: relative; top: -12px; left: 30px" alt="upArrow" />
	       <div class="suggestionList" id="autoSuggestionsList"></div>
	     </div>
	   </div>
   <!-- Source selector  --> 
   <div style="float:left;margin-top:10px;margin-left:30px;width:900px">  
			<table id="sources" style="width:98%" class="choosable highlightable data-table">
        <thead>
        <tr>
         <th style="width:9em;">Representation</th>
         <th style="width:6em;">View</th>
         <th style="width:10em;">Title</th>
         <th>Description</th>
         <th style="width:1em;"></th>
        </tr>
        </thead>
       <tbody class="dasSourceList">
        <tr id="source_1" title="Gene Names">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">Gene Names</td>
         <td class="desc">Ensembl HGNC genes, NCBI36 assembly</td>
         <td>
           <input class="url" type="hidden" value="http://das.sanger.ac.uk/das/hgnc36/features">
           <a class="delete" rel="#source_1" title="delete source_1" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>
        <tr id="source_2" title="OMIM">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">OMIM </td>
         <td class="desc">Catalogue of Human Genes Involved in Mendelian Genetic Disorders </td>
         <td>
           <input class="url" type="hidden" value="http://das.sanger.ac.uk/das/ens_36_omim_genes/features">
           <a class="delete" rel="#source_2" title="delete source_2" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>
        <tr id="source_3" title="Redon Clones">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">Redon Clones</td>
         <td class="desc">CNVs reported in normal individuals </td>
         <td>
           <input class="url" type="hidden" value="http://das.sanger.ac.uk/das/WGTP_loci_36/features">
           <a class="delete" rel="#source_3" title="delete source_3" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>
        <tr id="source_4" title="DGV">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">DGV </td>
         <td class="desc">Normal, Autism and Cancer Variation from literature </td>
         <td>
           <input class="url" type="hidden" value="http://das.sanger.ac.uk/das/toronto_poly_36/features">
           <a class="delete" rel="#source_4" title="delete source_4" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>
        <tr id="source_5" title="COSMIC">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">COSMIC</td>
         <td class="desc">Database of Somatic Mutations in Cancer</td>
         <td>
           <input class="url" type="hidden" value="http://das.sanger.ac.uk/das/cosmic_transcripts_ncbi36/features">
           <a class="delete" rel="#source_5" title="delete source_5" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>
        <tr id="source_6" title="Son">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">Son</td>
         <td class="desc">23andMe SNPs from member of family</td>
         <td>
           <input class="url" type="hidden" value="http://www.ebi.ac.uk/das-srv/easydas/bernat/das/son/features">
           <a class="delete" rel="#source_6" title="delete source_6" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>
        <tr id="source_7" title="Mom">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">Mom</td>
         <td class="desc">23andMe SNPs from member of family</td>
         <td>
           <input class="url" type="hidden" value="http://www.ebi.ac.uk/das-srv/easydas/bernat/das/mom/features">
           <a class="delete" rel="#source_7" title="delete source_7" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>
				<tr id="source_8" title="Dad">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">Dad</td>
         <td class="desc">23andMe SNPs from member of family</td>
         <td>
           <input class="url" type="hidden" value="http://www.ebi.ac.uk/das-srv/easydas/bernat/das/dad/features">
           <a class="delete" rel="#source_8" title="delete source_8" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>
				<tr id="source_9" title="Sister">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">Sister</td>
         <td class="desc">23andMe SNPs from member of family</td>
         <td>
           <input class="url" type="hidden" value="http://www.ebi.ac.uk/das-srv/easydas/bernat/das/sister/features">
           <a class="delete" rel="#source_9" title="delete source_9" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>
			 <tr id="source_10" title="Sister">
         <td><select class="representation_type"><option value="track">track</option><option value="mark">mark</option></select></td>
         <td><select class="selected_view"><option value="zoom">zoom</option><option value="chromosome">chromosome</option><option value="karyotype">karyotype</option></select></td>
         <td class="name">Aunt</td>
         <td class="desc">23andMe SNPs from member of family</td>
         <td>
           <input class="url" type="hidden" value="http://www.ebi.ac.uk/das-srv/easydas/bernat/das/aunt/features">
           <a class="delete" rel="#source_10" title="delete source_10" href="."><img src="img/delete_cross.png" title="Delete"></a> 
         </td>
        </tr>   
       </tbody>
      </table>
      
			<input type="Hidden" name="sDom" value='<"top" i>t<"bottom"lp>' class="data-table-options" />
			<input type="Hidden" name="iDisplayLength" value="-1" class="data-table-options" />
			<input type="Hidden" name="oLanguage" value='{"sZeroRecords": "Nothing found", "sInfo": "_START_ to _END_ of _TOTAL_ data sources", "sSearch": "", "sLengthMenu": "Show <select id=\"features_length\"><option value=\"1\">1</option><option value=\"10\">10</option><option value=\"25\">25</option><option value=\"50\">50</option><option value=\"-1\">All</option></select>"}' class="data-table-options" />
			
			<div id="show_add_source" class="data-table-bottom-buttons" style="float:right; padding-right: 10px; padding-bottom: 10px;">
			  <a href="#" class="button source_link" rel="facebox"><img style="text-decoration: none; vertical-align: top;" title="add source" src="img/add.png"></a>
			  <a href="#" class="button source_link">add your data</a>
			</div>

  </div> 
  <script type="text/javascript" src="js/sources.js" ></script>

  </form>
  <!--  Footer -->
  <div style="float:left;margin-left:30%;">
    <ul id="navmenu">
      <li><a href="about.html">About</a> | </li>
      <li><a href="FAQ.html">FAQ</a> | </li>
	  <li><a href="add_data.html">Adding data</a> | </li>
      <li><a href="https://code.google.com/p/karyodas/">Project Host</a> | </li>
      <li><a href="credits.html">Credits</a> | </li>
      <li><a href="disclaimer.html">Disclaimer</a></li>
    </ul>
  </div>
  </div>
     <div id="add_source" style="float:left;padding:10px;display:none;border-style:solid;border-width:5px;" >
      <form class="add_source_form" title="" style="display:inline;" method="post" action="">
       <div class="header"><h2>Add User-Defined Source</h2></div>
        <div style="padding:10px;"> 
          <ul id="navmenu">        
            <li><p>Name        <input size="35" id="name" style="float:right" name="name" type="text" class="required" value="Full Genome"></p></li>
            <li><p>URL         <input size="35" id="url" style="float:right" name="url" type="text" class="required" value="http://www.ebi.ac.uk/das-srv/easydas/bernat/das/full_genome/features"/></p></li>
            <li><p>Description&nbsp;&nbsp;<input size="35" id="desc" style="float:right" name="desc" type="text" class="required" value="User added 23andMe genotype"></p></li>
          </ul> 
        </div>     
        <div class="footer" style="display: block;">        
          <div style="float:right" class="buttons">
            <a class="button submit" href="#"><img style="text-decoration: none;" title="Upload" src="img/table_go.png"></a>
            <a class="button submit" href="#">add source</a> 

          </div>
        </div> 
     </form>
    </div> 
    <div id="bulk_upload" style="float:left;padding:10px;display:none;border-style:solid;border-width:5px;" >
      <form class="bulk_upload_form" title="" style="display:inline;" method="post" enctype="multipart/form-data"  action="#">
       <div class="header"><h2>Upload Your Genome</h2></div>
        <div style="padding:12px;">
            
            Name of the data source: <input name="name" type="text" class="required"><br></br>
            Description: <input name="desc" type="text" class="required"><br></br>
            Select a file to upload: <input name="file" type="file" class="required" />

        </div>     
        <div class="footer" style="display: block;">
          
          <div class="buttons">
            <a class="button submit" href="#"><img style="text-decoration: none;" title="Upload" src="img/table_go.png"></a>
            <a class="button submit" href="#">Upload</a> 
            <a class="button close" href="#"><img style="text-decoration: none;" title="Cancel" src="img/close.png"></a>
            <a class="button close" href="#">Cancel</a>
          </div>
        </div>
     </form>
    </div>
    
</body>
</html>
